import './WijmoComLogistics.scss'
import { useRequest } from 'alova/client'
import { Result, Steps } from "antd";

import { Http } from '../../API'
import { useMount } from 'ahooks';
import { useState } from 'react';

const WijmoComLogistics = ({ data }) => {
    const { logisticNumber, contactInfo } = data
    const [Traces, setTraces] = useState([])
    const { send } = useRequest(params => Http({ url: "getKdGoldAPI", params }), { immediate: false })

    useMount(() => {
        if (logisticNumber) {
            const lastFourChars = contactInfo.substr(-4);
            send({ LogisticCode: logisticNumber, contactInfo: lastFourChars }).then(res => {
                const data = JSON.parse(JSON.stringify(res.Traces.reverse()).replace(/AcceptTime/g, 'title').replace(/AcceptStation/g, 'description'))
                setTraces(data)
            })
        }
    })


    // getKdGoldAPI
    return (
        <div className="WijmoComLogistics">
            {Traces.length !== 0 ?
                <Steps direction="vertical" size="small" items={Traces} /> :
                <Result status="404" title="暂无物流信息内容-_-||" />
            }
        </div>
    );
};

export default WijmoComLogistics;